<template>
  <div>
    <h1>用户列表</h1>
    <table border="1">
      <tr>
        <td>编号</td>
        <td>姓名</td>
        <td>年龄</td>
        <td>生日</td>
        <td>操作</td>
      </tr>
      <tr v-for="user in users">
        <td>{{user.id}}</td>
        <td>{{ user.name }}</td>
        <td>{{ user.age }}</td>
        <td>{{ user.bir }}</td>
        <td><a href="javascript:;" @click="delUser(user.id)">删除</a>&nbsp;<a :href="'#/user/edit?id='+user.id">修改</a> </td>
      </tr>
    </table>
    <router-link to="user/add">新增</router-link>

    <router-view></router-view>
  </div>
</template>

<script>
export default {
  name: "user",
  data(){
    return{
      users:[]
    }
  },
  methods:{
    findAll(){
      this.$http.get("http://localhost:8989/user/findAll?page=1&rows=4").then((res)=>{
        this.users = res.data.result;
      });
    },
    delUser(id){
      this.$http.get("http://localhost:8989/user/del?id="+id).then(res=>{
        if (res.data.success){
          alert(res.data.msg);
          this.findAll();
        }
      })
    }
  },
  created() {
      this.findAll();
  },
  watch:{
    $route:{
      handler:function (val){
        if (val.path=="/user"){
          this.findAll();
        }
      },

    }
  },
}
</script>

<style scoped>

</style>
